<template>
  <view class="wrap">
    <view class="input">
      <uv-textarea v-model="desc" placeholder="请输入建议内容" count maxlength='500' height='300rpx' border='none'></uv-textarea>
    </view>
    <view class="foot">
      <button class="btn" hover-class="none" @click="tap">提交</button>
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { post } from '@/api';
import { toast } from '@/common';
import { onLoad } from '@dcloudio/uni-app';
import { useUser } from '@/store';

const userDetail = useUser().userDetail;
let desc = ref('');
let id = '';

onLoad((option) => {
  id = option.id;
})

function tap(){
  if(!desc.value) return toast('请输入建议内容');
  if(containsCodeOrHtml(desc.value)) return toast('禁止输入含有代码的内容')
  const params = {
    lessonId: id,
    content: desc.value,
    userId: userDetail.id
  }
  post('/api/lesson/pushComment', params).then(res => {
    if(res.code == 1){
      toast('发布成功');
      setTimeout(() => {
        uni.navigateBack({
          delta: 1
        });
      }, 1000)
    }
  })
}
function containsCodeOrHtml(input) {
  const codeBlockRegex = /```[\s\S]*?```/;

  const htmlRegex = /<\/?[\w\s="/.':;#-\/\?]+>/;

  return codeBlockRegex.test(input) || htmlRegex.test(input);
}
</script>

<style lang="scss" scoped>
  .foot{
    padding: 0 30rpx;
    padding-top: 160rpx;
  }
  .input{
    padding: 30rpx;
    background-color: #fff;
  }
  .wrap{
    width: 100%;
    min-height: 100vh;
    background-color: #F5F5F5;
  }
</style>